<template>
	<view class="page-fade-in" :style="{opacity: pageOpc}">
		<template v-if="pageOpc">
			<view class="content">
				<view class="change-box flexWrapNo" :style="{top:customHeight.top+'px',height:customHeight.height+'px'}" @tap="goPage('/pages/index/myStore')">
					切换门店
					<image src="../../static/index/change-icon.png" class="change-icon"></image>
				</view>
				<view :style="{paddingTop:navHeight+'px'}"></view>
				<view class="shop-info-box flexWrap">
					<view class="shop-info flexWarpColumn">
						<view class="shop-name">{{storeInfo.shop_name}}</view>
						<view class="status" :class="{'repair-status':storeInfo.store_status_data!='business'}">
							<block v-if="storeInfo.store_status_data=='business'">营业中</block>
							<block v-else-if="storeInfo.store_status_data=='rest'">休息中</block>
							<block v-else>筹备中</block>
						</view>
					</view>
					<view class="boss-img">
						<image src="../../static/index/bossImg.png"></image>
					</view>
				</view>
				<uni-notice-bar show-icon scrollable v-if="note" @tap="goPage('/pages/operate/operateDetails?id='+noteId)" :text="note" :speed='50' color="#6E6E6E" :fontSize="11" background-color="#FFFFFF"/>
				<!-- <view class="active-box flexWrap">
					<view class="active-item flexWrapNo" :class="{currment:!signin_status}" @tap="goPage('/pages/index/clock')">
						<image src="../../static/index/clock-icon.png" style="height: 30rpx;"></image>
						今日打卡
						<image src="../../static/index/fail-icon.png" class="fail-icon" v-if="!signin_status"></image>
					</view>
					<view class="active-item flexWrapNo" :class="{currment:!records_status}" @tap="goPage('/pages/index/noteList')">
						<image src="../../static/index/note-icon.png"></image>
						官方通知
						<image src="../../static/index/fail-icon.png" class="fail-icon" v-if="!records_status"></image>
					</view>
					<view class="active-item flexWrapNo" :class="{currment:!transmit_status}" @tap="goPage('/pages/index/forwardList')">
						<image src="../../static/index/forward-icon.png"></image>
						今日转发
						<image src="../../static/index/fail-icon.png" class="fail-icon" v-if="!transmit_status"></image>
					</view>
				</view> -->
				<view class="operation-box flexWrap">
					<view class="operation-item flexWarpCenterColumn" @tap="goPage('/pages/index/operatingData')">
						<view class="operation-img">
							<image src="../../static/index/operating-icon.png"></image>
						</view>
						<view>营业报表</view>
					</view>
					<view class="operation-item flexWarpCenterColumn" @tap="goPage('/pages/index/memberData')">
						<view class="operation-img">
							<image src="../../static/index/member-icon.png"></image>
						</view>
						<view>会员报表</view>
					</view>
					<view class="operation-item flexWarpCenterColumn" @tap="goPage('/pages/index/orderList')">
						<view class="operation-img">
							<image src="../../static/index/order-icon.png"></image>
						</view>
						<view>订单明细</view>
					</view>
					<!-- <view class="operation-item flexWarpCenterColumn" @tap="goManage()">
						<view class="operation-img">
							<image src="../../static/index/manage.png"></image>
						</view>
						<view>门店管理</view>
					</view> -->
					<view class="operation-item flexWarpCenterColumn" @tap="goPage('/pages/index/tableManage')">
						<view class="operation-img">
							<image src="../../static/index/table-icon.png"></image>
						</view>
						<view>桌台管理</view>
					</view>
				</view>
				<view class="profit-box flexWrap">
					<view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.order_count||'0.00'}}</view>
						<view class="profit-text">今日结账订单</view>
					</view>
					<view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.tatal_income||'0.00'}}</view>
						<view class="profit-text">今日收入</view>
					</view>
					<view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.cashout_amount||'0.00'}}</view>
						<view class="profit-text">可提现金额</view>
					</view>
					<view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.platform_commission||'0.00'}}</view>
						<view class="profit-text">系统服务费</view>
					</view>
					<view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.bank_amount||'0.00'}}</view>
						<view class="profit-text">银行手续费</view>
					</view>
					<view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.recharge_money||'0.00'}}</view>
						<view class="profit-text">充值收入</view>
					</view>
					<view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.order_online_amount||'0.00'}}</view>
						<view class="profit-text">订单收入</view>
					</view>
					<view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.tuan_amount||'0.00'}}</view>
						<view class="profit-text">美团收入</view>
					</view>
					<view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.douyin_amount||'0.00'}}</view>
						<view class="profit-text">抖音收入</view>
					</view>
					<!-- <view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.card_amount||'0.00'}}</view>
						<view class="profit-text">通卡收入</view>
					</view> -->
					<!-- <view class="profit-item flexWarpCenterColumn" @tap="goPage('/pages/index/monthlyReport')">
						<view>{{currentMonth}}月</view>
						<view class="profit-text">经营月报</view>
					</view> -->
					<!-- <view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.coupon_amount||'0.00'}}</view>
						<view class="profit-text">优惠券扣除</view>
					</view>
					<view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.ye_sum||'0.00'}}</view>
						<view class="profit-text">余额扣除</view>
					</view> -->
					<!-- <view class="profit-item flexWarpCenterColumn">
						<view>{{storeData.refund_money||'0.00'}}</view>
						<view class="profit-text">退款金额</view>
					</view> -->
				</view>
			</view>
		</template>
	</view>
</template>

<script>
	export default {
		data() {
			const currentMonth = this.getDate('start', 'month')
			return {
				pageOpc:0,
				customHeight:{
					height:30,
					top:20
				},
				navigationBarHeight:"",
				navHeight:"",
				iStatusBarHeight:"",
				storeInfo:{
					shop_name: "加载中...", //店铺姓名
					store_status_data: "business", //店铺状态:preparation=筹备中,business=营业中,closed_shop=已闭店
					count: 0, //今日结账订单
					money: 0, //订单总额
					recharge_consumption: 0, //充值消费金额
					coupon_deduction_money: 0, //卡卷抵扣金额
					recharge_money: 0 //充值金额
				},
				storeData:{
					yjz:0,
					order_ze:0,
					cz_sum:0,
					yhjqk:0,
					ye_sum:0,
					meituan_sum:0
				},
				note:"",
				noteId:"",
				signin_status:false,
				records_status:false,
				transmit_status:false,
				currentMonth:currentMonth
			}
		},
		onLoad() {
			// #ifdef MP-WEIXIN
			this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight;
			//胶囊高度
			// 获取微信胶囊的位置信息 width,height,top,right,left,bottom
			this.customHeight = wx.getMenuButtonBoundingClientRect()
			 // 导航栏高度(标题栏高度) = 胶囊高度 + (顶部距离 - 状态栏高度) * 2
			this.navigationBarHeight = this.customHeight.height + (this.customHeight.top - this.iStatusBarHeight) * 2
			// 总体高度 = 状态栏高度 + 导航栏高度
			this.navHeight = this.navigationBarHeight + this.iStatusBarHeight
			//#endif
			this.getStoreInfo();
		},
		onShow() {
			this.storeDetails();
		},
		onReady(){
			setTimeout(() => {
				this.pageOpc=1
			}, 100)
		},
		methods: {
			// 获取时间
			getDate(type, fields) {
				const date = new Date();
				date.setDate(date.getDate() - 1);
				if (type == 'start' && fields == 'day') { //粒度为天
					date.setDate(date.getDate() - 6);
				}
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				let result = ``
				if (fields == 'month') {
					month = month - 1
					result = `${month}`
				}
				return result;
			},
			goManage(){
				uni.switchTab({
					url:'/pages/manage/manage'
				})
			},
			getStoreInfo(){
				this.$request.post(this.$api.storeInfo, {
					store_id:uni.getStorageSync('store_id')
				}, {
					token:true
				}).then(res => {
					let {
						data = {}
					} = res;
					if (res.code==1) {
						if(data.consultation){
							this.note=data.consultation.title
							this.noteId=data.consultation.id
						}
					}
				})
			},
			// 店铺详情
			storeDetails(){
				this.$request.post(this.$api.storeDetails, {
					store_id:uni.getStorageSync('store_id')
				}, {
					token:true
				}).then(res => {
					console.log(res)
					if (res.code==1) {
						let {
							data = {}
						} = res;
						this.storeInfo=data.store_info
						this.storeData=data.as
						this.signin_status=data.signin_status
						this.records_status=data.records_status
						this.transmit_status=data.transmit_status
						uni.setStorageSync('shopname',data.store_info.shop_name)
						if(!data.consultation_status){
							uni.setTabBarBadge({
								index:2,
								text:'!'
							})
						}else{
							uni.removeTabBarBadge({
								index:data
							})
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	.content{
		padding: 34upx;
	}
	.active-box{
		.active-item{
			width: 188rpx;
			height: 88rpx;
			background: #1D1C5C;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			font-size: 24rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
			padding: 0 16rpx;
			image{
				width: 34rpx;
				height: 32rpx;
				margin-right: 10rpx;
			}
			.fail-icon{
				width: 38rpx;
				height: 38rpx;
				flex: none;
				margin: 0;
				margin-left: 10rpx;
			}
		}
		.currment{
			background: rgba(255, 70, 70, .4);
		}
	}
	.shop-info-box{
		height: 160upx;
		background:#EEC162;
		border-radius: 16upx;
		padding: 0 30upx;
		align-items: flex-end;
		// margin-top: 72upx;
		margin-bottom: 10rpx;
		.shop-info{
			justify-content: center;
			height: 100%;
			.shop-name{
				font-size: 36upx;
				font-family: PingFang SC;
				font-weight: 500;
				line-height: 50upx;
				color:#333333;
			}
			.status{
				width: 112upx;
				height: 40upx;
				line-height: 40upx;
				background: #50AB6E;
				border-radius: 36upx;
				font-size: 24upx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #FFFFFF;
				text-align: center;
				margin-top: 18upx;
			}
			.repair-status{
				background:#fc750d;
			}
		}
		.boss-img{
			width: 200upx;
			height: 200upx;
		}
	}
	.operation-box{
		margin-top: 30upx;
		.operation-item{
			font-size: 24upx;
			font-family: PingFang SC;
			font-weight: 400;
			line-height: 34upx;
			color: #0F0F0F;
			.operation-img{
				width: 140upx;
				height: 140upx;
				margin-bottom: 16upx;
			}
		}
	}
	.profit-box{
		flex-wrap: wrap;
		margin-top: 38upx;
		.profit-item{
			width: 330upx;
			height: 160upx;
			background: #FFFFFF;
			border-radius: 16upx;
			font-size: 48upx;
			font-family: PingFang SC;
			font-weight: bold;
			line-height: 66upx;
			color: #040336;
			justify-content: center;
			margin-bottom: 20upx;
			.profit-text{
				font-size: 24upx;
				font-family: PingFang SC;
				font-weight: 400;
				line-height: 34upx;
				color: #666666;
			}
		}
	}
</style>
